<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <link rel="stylesheet" href="http://at.alicdn.com/t/font_395997_wn6guvwmls5j0pb9.css">
  <!--<link rel="stylesheet" type="text/css" href="https://csshake.surge.sh/csshake.min.css">-->
  <script src="https://cdn.ckeditor.com/4.9.2/standard/ckeditor.js"></script>
  <title></title>
</head>
<body>
<div id="app"></div>
<div id="introduction" style="width: 100%;height: 300px;cursor:text"  ref="editor" class="edit" >
  我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45我是第一条测试数据45</div>
<!-- built files will be auto injected -->
<script>
  var introduction = document.getElementById( 'introduction' );
  introduction.setAttribute( 'contenteditable', true );

  CKEDITOR.inline( 'introduction', {
    // Allow some non-standard markup that we used in the introduction.
    extraAllowedContent: 'a(documentation);abbr[title];code',
    // removePlugins: 'stylescombo',
    // extraPlugins: 'sourcedialog',
    // Show toolbar on startup (optional).
    startupFocus: true,
    startupShowBorders : true
  } );
  CKEDITOR.on('instanceReady', function(event) {
    var editor = event.editor;
    if(typeof(editor) !== 'undefined') {
      editor.focus();
      window.focus();
      var element = editor.document.getBody()
      var range = editor.createRange();
      console.log(range)
      if(range) {
        range.moveToElementEditablePosition(element, false);
        range.select();
      }
    }
  });

</script>
</body>
</html>
